import 'package:fl_chart/fl_chart.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:ty_smart_watch/utils/Log.dart';

class SleepZChartView extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      color: Color(0xFFF5F5F6),
      child: Container(
        margin: EdgeInsets.symmetric(horizontal: 10,vertical: 6),
        decoration: const BoxDecoration(
          color: Colors.white,
          //圆角半径
          borderRadius: BorderRadius.all(Radius.circular(12.0)),
        ),
        padding: EdgeInsets.all(6),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            Row(
              children: [Text("睡眠心率", style: const TextStyle(color: Colors.black, fontSize: 12))],
            ),
            Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                Text(
                  "74",
                  style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold),
                ),
                SizedBox(width: 6),
                Text(
                  "次/分",
                  style: TextStyle(fontSize: 12),
                ),
              ],
            ),
            Text("11/13 06:10"),
            Expanded(child: LineChart(mainData()))
          ],
        ),
      ),
    );
  }

  LineChartData mainData() {
    return LineChartData(
      gridData: FlGridData(
        show: true,
        drawVerticalLine: false,
        drawHorizontalLine: true,
        horizontalInterval: 10,
        verticalInterval: 1,
        getDrawingHorizontalLine: (value) {
          return FlLine(
            color: Color(0xFFE2E2E2),
            strokeWidth: 1,
          );
        },
        getDrawingVerticalLine: (value) {
          return FlLine(
            color: Colors.yellow,
            strokeWidth: 1,
          );
        },
      ),
      titlesData: FlTitlesData(
        show: true,
        rightTitles: AxisTitles(
          sideTitles: SideTitles(
            showTitles: true,
            getTitlesWidget: rightTitleWidgets,
            // reservedSize:1,
          ),
        ),
        topTitles: AxisTitles(
          sideTitles: SideTitles(showTitles: false),
        ),
        bottomTitles: AxisTitles(
          sideTitles: SideTitles(
            showTitles: false,
            reservedSize: 30,
            interval: 1,
            // getTitlesWidget: bottomTitleWidgets,
          ),
        ),
        leftTitles: AxisTitles(
          sideTitles: SideTitles(
            showTitles: false,
            interval: 1,
            // getTitlesWidget: leftTitleWidgets,
            reservedSize: 42,
          ),
        ),
      ),
      borderData: FlBorderData(
        show: false,
        border: Border.all(color: Color(0xff37434d)),
      ),
      minX: 0,
      maxX: 24,
      minY: 60,
      maxY: 120,
      lineBarsData: [
        LineChartBarData(
          spots: const [
            FlSpot(0, 95),
            FlSpot(1, 86),
            FlSpot(2, 88),
            FlSpot(3, 87),
            FlSpot(4, 90),
            FlSpot(5, 84),
            FlSpot(6, 96),
            FlSpot(7, 95),
            FlSpot(8, 86),
            FlSpot(9, 88),
            FlSpot(10, 87),
            FlSpot(11, 90),
            FlSpot(12, 84),
            FlSpot(13, 96),
            FlSpot(14, 95),
            FlSpot(15, 86),
            FlSpot(16, 88),
            FlSpot(17, 87),
            FlSpot(18, 90),
            FlSpot(19, 84),
            FlSpot(20, 96),
            FlSpot(21, 95),
            FlSpot(22, 86),
            FlSpot(23, 88),
          ],
          isCurved: true,
          gradient: LinearGradient(
            colors: [Color(0xFFFF5850), Color(0xFFFF5850)],
          ),
          barWidth: 3,
          isStrokeCapRound: true,
          dotData: FlDotData(
            show: false,
          ),
          // belowBarData: BarAreaData(
          //   show: true,
          //   gradient: LinearGradient(
          //     colors:
          //         [Colors.cyan, Colors.blueGrey].map((color) => color.withOpacity(0.3)).toList(),
          //   ),
          // ),
        ),
      ],
    );
  }

  Widget rightTitleWidgets(double value, TitleMeta meta) {
    const style = TextStyle(
      fontWeight: FontWeight.bold,
      fontSize: 12,
    );
    Widget text;
    switch (value.toInt()) {
      case 2:
        text = const Text('MAR', style: style);
        break;
      case 5:
        text = const Text('JUN', style: style);
        break;
      case 8:
        text = const Text('SEP', style: style);
        break;
      default:
        text = const Text('', style: style);
        break;
    }

    return SideTitleWidget(
      axisSide: meta.axisSide,
      child: text,
    );
  }
}
